<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1"/>
    <title>后台管理面板</title>
    <link rel="stylesheet" th:href="@{/static/layui/css/layui.css}" media="all" />
    <link rel="stylesheet" th:href="@{/static/css/font_eolqem241z66flxr.css}" media="all" />
    <link rel="stylesheet" th:href="@{/static/css/main.css}" media="all" />
</head>
<body class="childrenBody">
<div class="panel_box row">
    <div class="panel col">
        <a href="javascript:;" data-url="page/message/message.html">
            <div class="panel_icon">
                <i class="layui-icon" data-icon="&#xe63a;">&#xe63a;</i>
            </div>
            <div class="panel_word newMessage">
                <span>#</span>
                <cite>新消息</cite>
            </div>
        </a>
    </div>
    <div class="panel col">
        <a href="javascript:;" data-url="page/user/allUsers.html">
            <div class="panel_icon" style="background-color:#FF5722;">
                <i class="iconfont icon-dongtaifensishu" data-icon="icon-dongtaifensishu"></i>
            </div>
            <div class="panel_word userAdd">
                <span>#</span>
                <cite>新增人数</cite>
            </div>
        </a>
    </div>
    <div class="panel col">
        <a href="javascript:;" data-url="page/user/allUsers.html">
            <div class="panel_icon" style="background-color:#009688;">
                <i class="layui-icon" data-icon="&#xe613;">&#xe613;</i>
            </div>
            <div class="panel_word userAll">
                <span id="userCount">#</span>
                <cite>用户数量</cite>
            </div>
        </a>
    </div>
    <div class="panel col">
        <a href="javascript:;" data-url="page/img/images.html">
            <div class="panel_icon" style="background-color:#5FB878;">
                <i class="layui-icon" data-icon="&#xe64a;">&#xe64a;</i>
            </div>
            <div class="panel_word imgAll">
                <span id="roleCount">#</span>
                <cite>角色数量</cite>
            </div>
        </a>
    </div>
    <div class="panel col">
        <a href="javascript:;" data-url="page/news/newsList.html">
            <div class="panel_icon" style="background-color:#F7B824;">
                <i class="iconfont icon-wenben" data-icon="icon-wenben"></i>
            </div>
            <div class="panel_word waitNews">
                <span>#</span>
                <cite>待审核文章</cite>
            </div>
        </a>
    </div>
    <div class="panel col max_panel">
        <a href="javascript:;" data-url="page/news/newsList.html">
            <div class="panel_icon" style="background-color:#2F4056;">
                <i class="iconfont icon-text" data-icon="icon-text"></i>
            </div>
            <div class="panel_word allNews">
                <span>#</span>
                <em>文章总数</em>
                <cite>文章列表</cite>
            </div>
        </a>
    </div>
</div>

<div class="layui-row">
    <div class="layui-col-xs4">
        <fieldset class="layui-elem-field layui-field-title" style="margin-top: 20px;">
            <legend>本站签约作者</legend>
        </fieldset>
        <div style="width: 200px;height: 390px;float: left;padding: 3px">
            <img th:src="@{/static/images/main/jly.jpg}" style="width: 200px;height: 270px;"/><br/>
            姓名:张XX<br/>
            年龄:18<br/>
            身高:160<br/>
            体重:***<br/>
        </div>

    </div>
    <div class="layui-col-xs8">
        <div class="layui-carousel" id="test1" style="margin: auto">
            <div carousel-item="">
                <div><img th:src="@{/static/images/hyrz/f1.jpg}" width="1024" height="700"/></div>
                <div><img th:src="@{/static/images/hyrz/f2.jpg}" width="1024" height="700"/></div>
                <div><img th:src="@{/static/images/hyrz/f3.jpg}" width="1024" height="700"/></div>
                <div><img th:src="@{/static/images/hyrz/f4.jpg}" width="1024" height="700"/></div>
                <div><img th:src="@{/static/images/hyrz/f5.jpg}" width="1024" height="700"/></div>
            </div>
        </div>
    </div>
</div>

<script type="text/javascript" th:src="@{/static/layui/layui.js}"></script>
<script type="text/javascript" th:inline="javascript">

    var ctxPath = /*[[@{/}]]*/ '';
    layui.use('carousel', function(){
        var carousel = layui.carousel,$ = layui.$;
        //建造实例
        carousel.render({
            elem: '#test1',
            width: '1024px', //设置容器宽度
            height: "700px",
            arrow: 'always' //始终显示箭头
            //,anim: 'updown' //切换动画方式
        });

        $.get({
            url: ctxPath + "/home/groupCount",
            success:function (data) {
                // 用户数量
                $("#userCount").text(data.data.userCount);
                // 角色数量
                $("#roleCount").text(data.data.roleCount);
            }
        });
    });
</script>
</body>
</html>